<template>
  <div>
    getters
    {{ length }}
    <!-- {{ todoDataById }} -->
    <!-- {{ todoListCount }} -->
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
  // 方法 1
  // computed: {
    // 通过属性访问
    // length(){
    //   return this.$store.getters.todoListCount
    // },
    // 通过方法访问
    // getter 在通过方法访问时，每次都会去进行调用，而不会缓存结果
  //   todoDataById(){
  //     return this.$store.getters.getTodoById(2)
  //   }
  // },

  computed: {
    // 方法 2
    // ...mapGetters(['todoListCount'])

    // 方法 3
    ...mapGetters({
      length: 'todoListCount'
    })

  }
}
</script>